import React, { Component, Fragment } from 'react';
import {
  Row, Col, Card,
} from 'antd';
import JishushengchanlvLeftForm from './components/JishushengchanlvLeftForm';
import JishushengchanlvResult from './components/JishushengchanlvResult';
import JizushengchanlvLeftForm from './components/JizushengchanlvLeftForm';
import JizushengchanlvResult from './components/JizushengchanlvResult';
import jishushengchanlv from './assets/jishushengchanlv';
import styles from './index.less';

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      result: 0,
    };
  }

  render() {
    const that = this;
    const {
      result,
    } = this.state;

    const leftFormProps = {
      workType: Object.keys(jishushengchanlv)[0],
      handleSubmit({ typeSelector, year, price, hoursPerYear }) {
        const { A: calA, B: calB, C: calC, Hw: calHW } = jishushengchanlv[typeSelector];
        that.setState({ result: 6.7 * price * calA * calB * Math.pow(hoursPerYear * year * 100 / calHW, calC) });
      },
    };

    const resultProps = {
      result,
    };

    return (
      <Fragment>
        <Card bordered={false} title="机组生产率">
          <Row>
            <Col xs={14}>
              <JizushengchanlvLeftForm {...leftFormProps} />
            </Col>
            <Col xs={8} offset={2} style={{ height: '100%' }}>
              <JizushengchanlvResult {...resultProps} />
            </Col>
          </Row>
        </Card>
        <Card bordered={false} title="技术生产率" style={{ marginTop: 12 }}>
          <Row>
            <Col xs={14}>
              <JishushengchanlvLeftForm {...leftFormProps} />
            </Col>
            <Col xs={8} offset={2} style={{ height: '100%' }}>
              <JishushengchanlvResult {...resultProps} />
            </Col>
          </Row>
        </Card>
      </Fragment>
    );
  }
}

export default Index;
